(function($){
    $.fn.crosswiseRoll = function(){
        var $this = this;

        var itemW = $this.find(".roll-item").css("width");    //每个item的宽度
        var itemLeft = $this.find(".roll-item").eq(1).css("margin-left"); //获得两个item之间的宽度
        var itemLen = $this.find(".roll-item").length;  // item的个数

        var itemBW = parseInt(itemW) * itemLen + parseInt(itemLeft) * (itemLen - 1);//整个滚动框的宽度

        var moveW = itemBW;    //所要移动的长度


        var copyItemBW = $this.find(".roll-box").html();
        $this.find(".roll-box").append(copyItemBW);    // 拷贝整个滚动框，并加到ul元素里面

        var num = 0;

        var anim;
        function fn(){
            anim = setInterval(function(){
                num+=1;
                if(num >= moveW){
                    num = 0;
                    $this.find(".roll-box").css("margin-left",num);
                }
                $this.find(".roll-box").css("margin-left",-num);
            },20);
        }
        fn();


        $this.find(".roll-box").mouseenter(function(){  //进入
            clearInterval(anim);
        });
        $this.find(".roll-box").mouseleave(function(){   //移出
            fn();
        });


        return $this;
    }
})(jQuery);
